<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('员工信息列表')" />
</head>
<body class="gray-bg">
     <div class="container-div">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <form id="formId">
                    <div class="select-list">
                        <ul>
                            <li class="select-time">
                                <p>生日区间：</p>
                                <input type="text" class="time-input" id="startTime" placeholder="开始时间" name="params[beginshengRi]" th:value="${beginshengRi}"/>
                                <span>-</span>
                                <input type="text" class="time-input" id="endTime" placeholder="结束时间" name="params[endshengRi]" th:value="${endshengRi}"/>
                            </li>
                            <li>
                                <p>姓名：</p>
                                <input type="text" name="xingMing"/>
                            </li>
                            <li>
                                <p>性别：</p>
                                <select name="xingBie" th:with="type=${@dict.getType('sys_user_sex')}">
                                    <option value="">所有</option>
                                    <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                                </select>
                            </li>
                            <li>
                                <p>一级部门：</p>
                                <input type="text" name="nianJi"/>
                            </li>
                            <li>
                                <p>合同主体：</p>
                                <select name="xueXiao" th:with="type=${@dict.getType('school')}">
                                    <option value="">所有</option>
                                    <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                                </select>
                            </li>
                            <li>
                                <p>职位：</p>
                                <input type="text" name="zhuanYe"/>
                            </li>
                            <li>
                                <p>手机号码：</p>
                                <input type="text" name="shouJiHaoMa"/>
                            </li>
                            <li>
                                <p>生日：</p>
                                <input type="text" name="shengRi"/>
                            </li>
                            <li>
                                <p>农或新：</p>
                                <select name="nongHuoXin" th:with="type=${@dict.getType('nongorxin')}">
                                    <option value="">所有</option>
                                    <option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
                                </select>
                            </li>
                            <li>
                                <p>今年生日：</p>
                                <input type="text" name="yuLiu1"/>
                            </li>
                           <!-- <li>
                                <p>星期：</p>
                                <input type="text" name="yuLiu2"/>
                            </li>
                            <li>
                                <p>是否送达：</p>
                                <input type="text" name="yuLiu3"/>
                            </li>-->
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="$.table.search()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>

            <div class="btn-group-sm" id="toolbar" role="group">
                <a class="btn btn-success" onclick="$.operate.add()" shiro:hasPermission="system:birthday:add">
                    <i class="fa fa-plus"></i> 添加
                </a>
                <a class="btn btn-primary single disabled" onclick="$.operate.edit()" shiro:hasPermission="system:birthday:edit">
                    <i class="fa fa-edit"></i> 修改
                </a>
                <a class="btn btn-danger multiple disabled" onclick="$.operate.removeAll()" shiro:hasPermission="system:birthday:remove">
                    <i class="fa fa-remove"></i> 删除
                </a>
                <a class="btn btn-warning" onclick="$.table.exportExcel()" shiro:hasPermission="system:birthday:export">
                    <i class="fa fa-download"></i> 导出
                 </a>
                <a class="btn btn-info" onclick="$.table.importExcel()" shiro:hasPermission="system:birthday:import">
                    <i class="fa fa-upload"></i> 导入
                </a>
                <a class="btn btn-info" onclick="newYear()" shiro:hasPermission="system:birthday:edit">
                    <i class="fa fa-upload"></i> 员工更新
                 </a>
            </div>
            <div id="left" class="col-sm-12 select-table table-striped">
                <table id="bootstrap-table"></table>
            </div>

            <div id="right" class="panel panel-default col-sm-6" style="display:none">
                <div class="panel-heading">
                    <h3 class="panel-title"><a id="turnRight"><i class="fa fa-arrow-left"></i></a><label>员工礼物列表: </label><font id="jobLabel"></font><input type="hidden"
                                                                                                                                                                       id="jobId"/> <div style="margin-top: 1px;">

                    </div></h3>

                </div>
                <div class="panel-body">
                    <div id="userToolbar">
                        <button id="assignButton" class="btn btn-outline btn-primary" title="添加礼物"><i
                                class="fa fa-user-plus"></i> 添加礼物
                        </button>
                    </div>
                    <!-- 表格 -->
                    <table id="jobTable"
                           data-toolbar="#userToolbar"
                           data-id-field="id">
                    </table>
                </div>
            </div>
        </div>

        </div>
    </div>
    <th:block th:include="include :: footer" />
    <script th:inline="javascript">
        var editFlag = [[${@permission.hasPermi('system:birthday:edit')}]];
        var removeFlag = [[${@permission.hasPermi('system:birthday:remove')}]];
        var xingBieDatas = [[${@dict.getType('sys_user_sex')}]];
        var xueXiaoDatas = [[${@dict.getType('school')}]];
        var nongHuoXinDatas = [[${@dict.getType('nongorxin')}]];
        var prefix = ctx + "system/birthday";

        $(function() {
            var options = {
                url: prefix + "/list",
                createUrl: prefix + "/add",
                updateUrl: prefix + "/edit/{id}",
                removeUrl: prefix + "/remove",
                exportUrl: prefix + "/export",
                importUrl: prefix + "/importData",
                importTemplateUrl: prefix + "/importTemplate",
                modalName: "员工信息",
                columns: [{
                    checkbox: true
                },
                {
                    field : 'id',
                    title : '编号',
                    visible: false
                },
                {
                    field : 'xingMing',
                    title : '姓名'
                },
                {
                    field : 'xingBie',
                    title : '性别',
                    formatter: function(value, row, index) {
                       return $.table.selectDictLabel(xingBieDatas, value);
                    }
                },
                    {
                        field : 'xueXiao',
                        title : '合同主体',
                        formatter: function(value, row, index) {
                            return $.table.selectDictLabel(xueXiaoDatas, value);
                        }
                    },
                {
                    field : 'nianJi',
                    title : '一级部门'
                },                {
                    field : 'erjibumen',
                    title : '二级部门'
                },                {
                    field : 'sanjibumen',
                    title : '三级部门'
                },

                {
                    field : 'zhuanYe',
                    title : '职位'
                },
                {
                    field : 'shouJiHaoMa',
                    title : '手机号码'
                },
                {
                    field : 'shengRi',
                    title : '生日'
                },
                {
                    field : 'nongHuoXin',
                    title : '农或新',
                    formatter: function(value, row, index) {
                       return $.table.selectDictLabel(nongHuoXinDatas, value);
                    }
                },
                {
                    field : 'yuLiu1',
                    title : '今年生日'
                },    {
                    field : 'rztime',
                    title : '入职日期'
                },

                    {
                        field : 'rztime',
                        title : '司龄',
                        formatter: function (value, row, index) {
                            return silin(row);
                        }
                    },
                {
                    field : 'yuLiu2',
                    title : '星期'
                },
                {
                    field : 'yuLiu3',
                    title : '是否送达',
                    formatter: function (value, row, index) {
                        return statusTools(row);
                    }
                },
                {
                    field : 'remark',
                    title : '备注信息'
                },
                {
                    title: '操作',
                    align: 'center',

                    events: {
                        'click .assign': function (e, value, row, index) {
                            $("#left").attr("class", "col-sm-6");
                            setTimeout(function () {
                                $("#right").fadeIn(500);
                            }, 500)
                            $("#jobLabel").html(row.xingMing);
                            $("#jobId").val(row.id);
                            $('#jobTable').bootstrapTable("refresh", {query: {delFlag: row.id}})
                        }
                    },

                    formatter: function(value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="$.operate.edit(\'' + row.id + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                        actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="javascript:void(0)" onclick="$.operate.remove(\'' + row.id + '\')"><i class="fa fa-remove"></i>删除</a>');
                        actions.push('<a class="btn btn-warning btn-xs assign" href="#jobId" "><i class="fa fa-arrow-right">礼物</i></a>');
                        return actions.join('');
                    }
                }]
            };
            $.table.init(options);
        });
    </script>


     <script>

         $(document).ready(function () {
             $('#jobTable').bootstrapTable({
                 //请求方法
                 method: 'get',
                 dataType: "json",
                 //是否显示行间隔色
                 striped: true,
                 //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
                 cache: true,
                 //是否显示分页（*）
                 pagination: true,

                 pageList: [10, 25, 50, 100],
                 //这个接口需要处理bootstrap table传递的固定参数,并返回特定格式的json数据
                 url: "/system/liwu/list",
                 //默认值为 'limit',传给服务端的参数为：limit, offset, search, sort, order Else
                 //queryParamsType:'',
                 ////查询参数,每次调用是会带上这个参数，可自定义
                 //分页方式：client客户端分页，server服务端分页（*）
                 sidePagination: "server",
                 columns: [
                     {
                         field: 'id',
                         title: '编号',
                         visible: false
                     },
                     {
                         field: 'xingMing',
                         title: '姓名',
                         visible: false
                     },
                     {
                         field: 'liWu',
                         title: '礼物'
                     },
                     {
                         field: 'lingSongRen',
                         title: '领送人'
                     },
                     {
                         field: 'songDaShiJian',
                         title: '送达时间'
                     },
                     {
                         field: 'remark',
                         title: '备注信息'

                     },
                     {
                         title: '操作',
                         align: 'center',
                         formatter: function (value, row, index) {
                             var actions = [];
                             actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="$.modal.open(\'修改礼物信息\' , \'/system/liwu/edit/' + row.id + '\',500,600)"><i class="fa fa-edit"></i>编辑</a> ');
                             return actions.join('');
                         }
                     }]

             });

             if (navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i)) {//如果是移动端
                 $('#jobTable').bootstrapTable("toggleView");
             }


             $("#assignButton").click(function () {
                 $.modal.open("添加礼物信息", "/system/liwu/add/{id}".replace("{id}", $("#jobId").val()), 500, 600, function (index, layero) {
                     var iframeWin = layero.find('iframe')[0];
                     iframeWin.contentWindow.submitHandler(index, layero, function () {
                         $("#jobTable").bootstrapTable("refresh", {query: {delFlag: $("#jobId").val()}});
                     });

                 });
             });

             $("#turnRight").click(function () {
                 $("#left").attr("class", "col-sm-12");
                 $("#right").css("display", "none");
             });
         });

         /* 用户状态显示 */
         function statusTools(row) {
             if (row.yuLiu3 != 1) {
                 return '<i class=\"fa fa-toggle-off text-info fa-2x\" onclick="enable(\'' + row.id + '\')"></i> ';
             } else {
                 return '<i class=\"fa fa-toggle-on text-info fa-2x\" onclick="disable(\'' + row.id + '\')"></i> ';
             }
         }

         /* 用户状态显示 */
         function silin(row) {

             let number = ((new Date() - new Date(row.rztime))/3600/24/1000/365.0).toFixed(1);

           return number ;
         }


         /* 用户管理-停用 */
         function disable(userId) {
             $.modal.confirm("确认回退礼物了吗？", function() {
                 $.operate.post(prefix + "/changeStatus", { "id": userId, "yuLiu3": 0 });
             })
         }

         /* 用户管理启用 */
         function enable(userId) {
             $.modal.confirm("确认送达礼物了吗？", function() {
                 $.operate.post(prefix + "/changeStatus", { "id": userId, "yuLiu3": 1 });
             })
         }
         /* 跨年更新生日 */
         function newYear() {
             $.modal.confirm("确认更新学生当年生日吗?", function() {
                 $.operate.submit("/system/birthday/updateNewYear", "post");
             });
         }

     </script>
</body>

<!-- 导入区域 -->
<script id="importTpl" type="text/template">
    <form enctype="multipart/form-data" class="mt20 mb10">
        <div class="col-xs-offset-1">
            <input type="file" id="file" name="file"/>
            <div class="mt10 pt5">
                <input type="checkbox" id="updateSupport" name="updateSupport" title="如果登录账户已经存在，更新这条数据。"> 是否更新已经存在的用户数据
                &nbsp;	<a onclick="$.table.importTemplate()" class="btn btn-default btn-xs"><i class="fa fa-file-excel-o"></i> 下载模板</a>
            </div>
            <font color="red" class="pull-left mt10">
                提示：仅允许导入“xls”或“xlsx”格式文件！
            </font>
        </div>
    </form>
</script>
</html>
